﻿@model KPIS.GERP.WEB.GIMS.Controllers.AbsenceAdminFilter

@{
    ViewBag.Title = "ปฎิทินการขอลา";
    if(CompareUtility.IsObjectToStringEqual(Request["emptylayout"], "true"))
    {
        Layout = "~/Views/Shared/_EmptyLayout.cshtml";
    } 
    var mo = new DateTime(DateTime.Now.Year, 1, 1);
    var itemMonth = new List<SelectListItem>
                {
                    new SelectListItem{Text=(mo=mo.AddMonths(0)).ToString("MMMM"), Value = "1", Selected = DateTime.Now.Month == 1},
                    new SelectListItem{Text=(mo=mo.AddMonths(1)).ToString("MMMM"), Value = "2", Selected = DateTime.Now.Month == 1},
                    new SelectListItem{Text=(mo=mo.AddMonths(1)).ToString("MMMM"), Value = "3", Selected = DateTime.Now.Month == 1},
                    new SelectListItem{Text=(mo=mo.AddMonths(1)).ToString("MMMM"), Value = "4", Selected = DateTime.Now.Month == 1}
                    ,
                    new SelectListItem{Text=(mo=mo.AddMonths(1)).ToString("MMMM"), Value = "5", Selected = DateTime.Now.Month == 1},
                    new SelectListItem{Text=(mo=mo.AddMonths(1)).ToString("MMMM"), Value = "6", Selected = DateTime.Now.Month == 1},
                    new SelectListItem{Text=(mo=mo.AddMonths(1)).ToString("MMMM"), Value = "7", Selected = DateTime.Now.Month == 1},
                    new SelectListItem{Text=(mo=mo.AddMonths(1)).ToString("MMMM"), Value = "8", Selected = DateTime.Now.Month == 1}
                    ,
                    new SelectListItem{Text=(mo=mo.AddMonths(1)).ToString("MMMM"), Value = "9", Selected = DateTime.Now.Month == 1},
                    new SelectListItem{Text=(mo=mo.AddMonths(1)).ToString("MMMM"), Value = "10", Selected = DateTime.Now.Month == 1},
                    new SelectListItem{Text=(mo=mo.AddMonths(1)).ToString("MMMM"), Value = "11", Selected = DateTime.Now.Month == 1},
                    new SelectListItem{Text=(mo=mo.AddMonths(1)).ToString("MMMM"), Value = "12", Selected = DateTime.Now.Month == 1}

                };

    var itemYear = new List<SelectListItem>();
    for (int i = -10; i < 10; i++)
    {
        var y = DateTime.Now.AddYears(i);
        itemYear.Add(new SelectListItem { Text = y.ToString("yyyy"), Value = y.ToString("yyyy"), Selected = y.Year == DateTime.Now.Year });
    }
}
<style>
    .Table1 td {
        width: 26px;
        text-align: center;
        margin-bottom: 30px;
    }
    .loading {
        position: absolute;
        display: none;
        border: 1px solid #5c9ccc;
        padding: 2px;
        background-color: #5c9ccc;
        color: #ffffff;
        opacity: 0.90;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        min-width: 100px;
        min-height: 50px;
        text-align: center;
        z-index: 100000;
    }
    .nondecore {
        text-decoration: none;
    }
    .styleNonWorkingDay {
        font-weight: bold;
        background: #F5F6CE;
    }
    .W {
        color: #5c9ccc;
        font-size: 14px;
        width: 140px;
    }
    .J {
        color: #9b4130;
        font-size: 14px;
    }
    .U {
        color: #04a31c;
        font-weight: bold;
        font-size: 14px;
    }
    .A {
        color: #73a411;
        font-weight: bold;
        font-size: 14px;
    }
    .R {
        color: #cd279e;
        font-size: 14px;
    }
    .P {
        color: #194668;
        font-size: 14px;
    }
    .C {
        color: red;
        font-size: 14px;
    }
    .D {
        color: #929292;
        font-size: 14px;
    } 
     
    .myFilterBox {
        padding: 10px 0 25px 25px;
        background-color: white;
        /* outer shadows  (note the rgba is red, green, blue, alpha) */
        -webkit-box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.4);
        -moz-box-shadow: 0px 1px 3px rgba(23, 69, 88, .5);
        /* rounded corners */
        -webkit-border-radius: 6px;
        -moz-border-radius: 4px;
        border-radius: 4px;
        /* gradients */
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, white), color-stop(15%, white), color-stop(100%, #D7E9F5));
        background: -moz-linear-gradient(top, white 0%, white 55%, #D5E4F3 130%);
    }
    .celltotal {
        font-size: 15px;
        font-weight: bolder;

    }
</style>

<div > 
    <div style="margin: 10px 10px 10px 10px;">
        <div class="myFilterBox">
            <h4>การเลือกดูข้อมูล</h4>
            <hr />
            <table>
                <tr>
                    <td>
                        <strong>เดือนที่แสดงผล: </strong>
                    </td>
                    <td colspan="4">
                        @Html.DropDownListFor(m => m.Month, itemMonth, new Dictionary<string, object>{{"class","chzn-select"},
                        {"data-placeholder", "เลือกเดือน"}})
                        @Html.DropDownListFor(m => m.Year, itemYear, new Dictionary<string, object>{{"class","chzn-select"},
                        {"data-placeholder", "เลือกปี"}})
                    </td>
                </tr>
                <tr>
                    <td>
                        <strong>สถานะ (วันลาที่มีผลสมบูรณ์): </strong>
                    </td>

                    <td style="width:150px;">
                        <label>
                            <input type="checkbox" id="chbU" name="chbU" value="true" checked="checked" />
                            <span class="lbl U">ใช้งานอยู่</span>
                        </label>
                    </td>

                    <td style="width: 150px;">
                        <label>
                            <input type="checkbox" id="chbA" name="chbA" value="true" checked="checked" />
                            <span class="lbl A">อนุมัติแล้ว</span>
                        </label>
                    </td>

                    <td style="width: 150px;"></td>
                </tr>
                <tr>
                    <td>
                        <strong>สถานะ (วันลาที่รออนุมัติ): </strong>
                    </td>

                    <td>
                        <label>
                            <input type="checkbox" id="chbP" name="chbP" value="true" checked="checked" />
                            <span class="lbl P">รออนุมัติ</span>
                        </label>
                    </td>

                    <td>
                        <label>
                            <input type="checkbox" id="chbR" name="chbR" value="true" checked="checked" />
                            <span class="lbl R">ถูกส่งกลับให้แก้ไข</span>
                        </label>
                    </td>

                </tr>
                <tr>
                    <td>
                        <strong>สถานะ (ยังไม่คิดวันลา): </strong>
                    </td>

                    <td>
                        <label>
                            <input type="checkbox" id="chbW" name="chbW" value="true" checked="checked" />
                            <span class="lbl W"> ยังไม่ส่งขออนุมัติ</span>
                        </label>
                    </td>

                </tr>
                <tr>
                    <td>
                        <strong>สถานะ (วันลาที่ถือว่ายกเลิก): </strong>
                    </td>

                    <td>
                        <label>
                            <input type="checkbox" id="chbJ" name="chbJ" value="true" />
                            <span class="lbl J">ไม่ผ่านการอนุมัติ</span>
                        </label>
                    </td>

                    <td>
                        <label>
                            <input type="checkbox" id="chbC" name="chbC" value="true" />
                            <span class="lbl C">ยกเลิก</span>
                        </label>
                    </td>
                </tr>
            </table> 
            <hr />
            <center>
                <button id="btnSearch">ค้นหา</button>
            </center>
        </div>
    </div>

    <div id="panelTable" style="border: solid 2px rgb(13, 179, 201);  position: relative; min-height:300px;  margin-bottom: 30px">
        <!-- initial -->
         <div id="report-loading" class="loading">
            <img src="~/Content/images/Photo/white_283x212_loading.gif" width="100px" height="50px" /><br /><strong>กำลังโหลด...</strong>
        </div>
    </div>
</div>

@section scripts {
    
    <script type="text/javascript">
        $(function () {
             
            loadAbsence();
            $('#btnSearch').click(function () {
                loadAbsence();
            });
        });
        
        var loadAbsence = function() {

            var month = $('#Month').val();
            var year = $('#Year').val();
            var chbW = $('#chbW').prop('checked' );;
            var chbJ = $('#chbJ').prop('checked' );;
            var chbU = $('#chbU').prop('checked' );;
            var chbA = $('#chbA').prop('checked' );;
            var chbR = $('#chbR').prop('checked' );;
            var chbP = $('#chbP').prop('checked' );;
            var chbC = $('#chbC').prop('checked' );;
            var url = '@Url.Action("_IndexGrid")?month=' + month + '&year=' + year +
                '&chbW=' + chbW +'&chbJ=' + chbJ +'&chbU=' + chbU +
                '&chbA=' + chbA + '&chbR=' + chbR + '&chbP=' + chbP +
                '&chbC=' + chbC;


            $("#report-loading").css({
                top: 100,
                left: (($("#panelTable").width() / 2) - 50)
            }).fadeIn(200); // fast fade in of 200 mili-seconds
            $("#panelTable").load(url, function (responseTxt, statusTxt, xhr) {
                if (statusTxt == "success") {
                    //alert("External content loaded successfully!");
                }
                if (statusTxt == "error") {
                    alert("Error: " + xhr.status + ": " + xhr.statusText);
                }
                $("#report-loading", this).fadeOut(1000); // slow fade out of 1 second
            });
        }
    </script>
}